<template>
  <div>
    <!--<ggg :msg='msg'></ggg>-->
    <el-menu id="menu" :default-active="$route.path" background-color="#545c64" text-color="#fff" router style="text-align: left" unique-opened>
      <template v-for="(item,index) in msg">
        <ggg :mm="item"/>
      </template>
    </el-menu>
  </div>
</template>

<script>
  export default {
    name: 'Sider',
    data () {
      return {}
    },
    components: {
      ggg: {
        name: 'gs',
        template: `<el-submenu v-if="mm.children" :index="mm.url">
            <template slot="title">{{ mm.name }}</template>
            <template v-for="c in mm.children">
            <gs :mm="c"/>
            </template>
          </el-submenu>
          <el-menu-item v-else :index.sync="mm.url">{{ mm.name }}
          </el-menu-item>`,
        props: ['mm'],
        data () {
          return {}
        }
      }
    },
    props: ['msg']
  }
</script>
<style>
  .el-menu--dark {
    background-color: #545c64;
  }
</style>
